<template>
  <div class="container" ref="mainCon">
    <topTitle :titleText="titleText"></topTitle>
    <div class="mainCon">
      <div
        ref="tableBox"
        :class="hiddleToolBar ? 'tableBoxCur tableBox' : 'tableBoxCur'"
      >
        <div>
          <el-button
            type="primary"
            class="commonBut saveBtn funComBut"
            icon="icon iconfont icontianjia"
            @click="skip"
            v-if="isShowBtn"
            style="padding: 0 15px; margin-bottom: 24px"
          >
            <span class="opetareText">{{ btnText }}</span>
          </el-button>
          <exportBtn
            :dataLen="tableList.length"
            api="api-s/report/export_JC_ZS_ASSESS_PUBLISH"
            :filterField="filterField"
            style="padding: 0 15px; margin-bottom: 24px"
          ></exportBtn>
        </div>
        <el-table
          ref="tableBox1"
          :max-height="tableHeight"
          @sort-change="sortChange"
          :data="tableList"
          v-loading="loading"
          :header-cell-style="{ background: '#eef1f6', color: '#606266' }"
          highlight-current-row
          stripe
          style="border: 1px solid #dfe6ec"
        >
          <el-table-column prop="name" label="考核名称" width="230">
            <template slot-scope="scope">
              <copyText
                :tableIndex="scope.$index"
                :copyTextName="scope.row.name"
                :columnName="'name'"
              ></copyText>
            </template>
          </el-table-column>
          <el-table-column
            prop="total"
            label="考核事项"
            sortable="custom"
            align="center"
            :formatter="formatTd"
          >
            <template slot-scope="scope"> {{ scope.row.total }}个 </template>
          </el-table-column>
          <el-table-column
            prop="statusName"
            label="状态"
            align="center"
          ></el-table-column>
          <el-table-column
            label="操作"
            align="left"
            :formatter="formatTd"
            width="210"
            fixed="right"
          >
            <template slot-scope="scope">
              <div
                v-if="
                  isShowUpdateBtn ||
                  (scope.row.statusName === '待发布' && isShowPublishBtn) ||
                  (scope.row.statusName === '待发布' && isShowDelBtn)
                "
              >
                <el-link
                  type="primary"
                  @click="toModify(scope.$index, scope.row)"
                  v-if="isShowUpdateBtn"
                  >修改考核</el-link
                >
                <el-link
                  v-if="scope.row.statusName === '待发布' && isShowPublishBtn"
                  type="primary"
                  @click="toRelease(scope.$index, scope.row)"
                  >发布</el-link
                >
                <el-link
                  v-if="scope.row.statusName === '待发布' && isShowDelBtn"
                  type="primary"
                  @click="toDelete(scope.$index, scope.row)"
                  >删除</el-link
                >
              </div>
              <span v-else>--</span>
            </template>
          </el-table-column>
          <!-- 表格数据为空时，页面显示 -->
          <div slot="empty" v-show="isShow">
            <emptyTable emptyText="暂无相关信息"></emptyTable>
          </div>
        </el-table>
        <!-- getTableList为获取子组件的数据 -->
        <Pagination
          ref="pagination"
          :filterField="filterField"
          @getList="getTableList"
          :requestUrl="requestUrl"
        ></Pagination>
      </div>
    </div>

    <!-- <el-dialog
      :close-on-click-modal="false"
      title="发布考核"
      :visible.sync="releaseDialog"
      width="30%"
      :modal-append-to-body="false"
        :append-to-body="true"
      >
      <span>请确认是否发布考核，发布后将不能废止，仅能修改自评到期时间</span>
      <div slot="footer" class="dialog-footer">
        <el-button @click="releaseDialog = false" class="cancel">取 消</el-button>
        <el-button type="primary" @click="doRelease" class="save">确 定</el-button>
        </div>
    </el-dialog> -->
    <el-dialog
      :close-on-click-modal="false"
      title="删除考核"
      :visible.sync="deleteDialog"
      width="30%"
      :modal-append-to-body="false"
      :append-to-body="true"
    >
      <span>请确认是否删除考核，删除操作不可逆</span>
      <div slot="footer" class="dialog-footer">
        <el-button @click="deleteDialog = false" class="cancel"
          >取 消</el-button
        >
        <el-button type="primary" @click="doDelete" class="save"
          >确 定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import scrollTable from '@/mixin/scrollTable.js'

export default {
  name: 'checkAffairsList',
  mixins: [scrollTable],
  data() {
    return {
      filterField: {},
      titleText: '发布政务考核',
      btnText: '创建考核',
      pathUrl: '/home/checkAffairs/createCheck',
      oldUrl: '/home/checkAffairs/checkAffairsList',
      releaseDialog: false,
      deleteDialog: false,
      currentId: 0,
      //表格数据
      tableList: [],
      requestUrl: 'api-gov/assesspublish/expand/assesspublishpage',
      isShow: false, //列表加载
      // loading: true,
      loading: false,
      isShowBtn: '',
      isShowUpdateBtn: '',
      isShowDelBtn: '',
      isShowPublishBtn: '',
    }
  },
  created() {
    this.$nextTick(function () {
      this.$refs.pagination.getTableListData()
    })
    this.isShowBtn =
      this.$store.state.buttonLimitsArr.indexOf('checkAffairsList:add') > -1
    this.isShowUpdateBtn =
      this.$store.state.buttonLimitsArr.indexOf('checkAffairsList:update') > -1
    this.isShowDelBtn =
      this.$store.state.buttonLimitsArr.indexOf('checkAffairsList:delete') > -1
    this.isShowPublishBtn =
      this.$store.state.buttonLimitsArr.indexOf('checkAffairsList:update') > -1
  },
  activated: function () {},
  methods: {
    searchList() {
      this.$refs.pagination.getTableListData()
    },
    getTableList(data) {
      this.tableList = data
      this.loading = false
      if (this.tableList.length < 1) {
        this.isShow = true
      }
    },

    toRelease(index, rowData) {
      // this.releaseDialog = true;
      this.currentId = rowData.id
      this.$confirm(
        '请确认是否发布考核，发布后将不能废止，仅能修改自评到期时间',
        '提示',
        {
          confirmButtonText: '确定',
          type: 'warning',
          showCancelButton: false,
        }
      )
        .then(() => {
          this.doRelease()
        })
        .catch((action) => {})
    },
    doRelease() {
      // this.releaseDialog = false;
      this.axios({
        method: 'post',
        url: 'api-gov/assesspublish/expand/publishassess',
        data: { assessId: this.currentId },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.$message({
              type: 'success',
              message: '发布成功',
            })
            this.searchList()
          } else {
            this.$message({
              type: 'error',
              message: response.data.errorMsg,
            })
          }
        })
        .catch((error) => {})
    },
    toModify(index, rowData) {
      this.$router.push({
        path: '/home/checkAffairs/createCheck',
        name: 'createCheck',
        query: {
          id: rowData.id,
        },
      })
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: '/home/checkAffairs/checkAffairsList',
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
    toAdd() {
      this.$router.push({ name: 'createCheck' })
    },
    toDelete(index, rowData) {
      this.currentId = rowData.id
      this.$confirm('请确认是否删除考核，删除操作不可逆', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          this.doDelete()
        })
        .catch((action) => {})
    },
    doDelete() {
      this.axios({
        method: 'post',
        url: 'api-gov/assesspublish/expand/deleteassess',
        data: { id: this.currentId },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.$message({
              type: 'success',
              message: '删除成功',
            })
            this.searchList()
          } else {
            this.$message({
              type: 'error',
              message: response.data.msg,
            })
          }
        })
        .catch((error) => {})
    },
    skip() {
      this.$router.push(this.pathUrl)
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: this.oldUrl,
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
  },
}
</script>

<style scoped lang="less">
.saveBtn {
  padding: 10px 20px;
  background-color: #009588;
  border-color: #009588;
  color: #fff;
}

.mainCon {
  padding-top: 0;
}

.nav ul {
  list-style: none;
}

.nav li {
  display: block;
  float: left;
}
</style>
